#app{
    text-align: center;
    line-height: 100px;
    height: 500px;
  }
  .sidebar {
      float: left;
      width: 30%;
  }
  .content {
      float: left;
      width: 70%;
  }


  /* ///////////////// */


  .fade-enter-active, .fade-leave-active {
    transition: opacity .5s;
    font-size: 20px;
  }
  .fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
    opacity: 0;
  }

  .slide-fade-enter-active {
      transition: all .3s ease;
    }
    .slide-fade-leave-active {
      transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
    }
    .slide-fade-enter, .slide-fade-leave-to
    /* .slide-fade-leave-active for below version 2.1.8 */ {
      transform: translateX(10px);
      opacity: 0;
    }

/* /////////////////////// */

    .bounce-enter-active {
        animation: bounce-in .5s;
      }
      .bounce-leave-active {
        animation: bounce-in .5s reverse;
      }
      @keyframes bounce-in {
        0% {
          transform: scale(0);
          -webkit-transform: scale(0);    /* Safari and Chrome */
        }
        50% {
          transform: scale(1.5);
          -webkit-transform: scale(1.5); 
        }
        100% {
          transform: scale(1);
          -webkit-transform: scale(1); 
        }
      }